/**
 * 结合zepto实现手机端模拟QQ信息左滑
 * create by dave on 2018/1/8
 * 实现思路：touchstart() 获取当前触摸坐标 touchend() 获取结束触摸位置 以差值来判断滑动方向 touchmove() 来实时获取滑动距离
 */
window.slideleft = (function ($) {

    var listItem = $('.weui_cell_bd'),
        listOpts = $('.slideleft');

    var onthel = false, // 是否处于最左端
        isScroll = false, // 列表是否滚动状态
        initX = 0, // 初始X坐标
        initY = 0, // 初始Y坐标
        endX = 0, // 结束时X坐标
        endY = 0, // 结束时Y坐标
        moveX = 0, // listItem 移动的距离
        expandLi = null; // 是否存在展开的list

    var slideMaxWid = listOpts.width();//向左滑最大距离

    var handleSlide = (function () {

        listItem.on('touchstart', function (e) {
            // 判断有无已经展开的li，如果有，是否是当前的li，如果不是，将展开的li收起
            if (expandLi) {
                if (expandLi.parent().index() !== $(this).parent().index()) {
                    // 判断当前list是左滑还是上下滑
                    if (Math.abs(endY - initY) < Math.abs(endX - initX)) {
                        e.preventDefault();
                    }
                    expandLi.css('-webkit-transform', 'translateX(' + 0 + 'px)');
                }
            }

            initX = e.targetTouches[0].pageX;
            initY = e.targetTouches[0].pageY;

            moveX = $(this).offset().left;

            $(this).on('touchmove', function (e) {

                var curY = e.targetTouches[0].pageY;
                var curX = e.targetTouches[0].pageX;
                var X = curX - initX; // 不断获取移动的距离

                $(this).removeClass('animated');

                if (Math.abs(endY - initY) < Math.abs(endX - initX)) {

                    e.preventDefault();
                    if (moveX == 0) {
                        if (X > 0) {
                            $(this).css('-webkit-transform', 'translateX(' + 0 + 'px)');
                        } else if (X < 0) {
                            if (X < -slideMaxWid) X = -slideMaxWid;
                            $(this).css('-webkit-transform', 'translateX(' + X + 'px)');
                        }
                    }
                    // 已经处于最左
                    else if (moveX < 0) {
                        onthel = true;
                        if (X > 0) { // 向右滑
                            if (X - slideMaxWid > 0) {
                                $(this).css('-webkit-transform', 'translateX(' + 0 + 'px)');
                            } else {
                                $(this).css('-webkit-transform', 'translateX(' + (X - slideMaxWid) + 'px)');
                            }
                        } else { // 左滑
                            $(this).addClass('animated');
                            $(this).css('-webkit-transform', 'translateX(' + 0 + 'px)');
                        }
                    }
                } else {
                    isScroll = true;
                }

            })
        });

        listItem.on('touchend', function (e) {

            endX = e.changedTouches[0].pageX;
            endY = e.changedTouches[0].pageY;
            var X = endX - initX;

            $(this).addClass('animated');
            //Slide to right or the distance of slide to left less than 20;
            if (X > -20 || onthel || isScroll) {
                $(this).css('-webkit-transform', 'translateX(' + 0 + 'px)');
                onthel = false;
                isScroll = false;
            } else {
                $(this).css('-webkit-transform', 'translateX(' + (-slideMaxWid) + 'px)');
                expandLi = $(this);
            }
        })

    })();

})(Zepto);
